<div class="panel panel-default devices">
  <div class="panel-heading">
    <form class="form-inline">
      <div class="form-group">
        <input ng-model="deviceid" class="form-control"
               type="text" placeholder="Device ID">
        <button ng-click="quickSearch()" type="button"
                class="btn btn-primary">Quick Search</button>
      </div>
      <div class="btn-group pull-right">
        <button ng-click="resetSearch()" type="button"
                class="btn btn-warning">Reset</button>
        <button ng-click="advancedSearch()" type="button"
                class="btn btn-primary">Advanced Search</button>
      </div>
    </form>
  </div>
  <table class="table table-striped table-hover">
    <thead>
      <tr>
        <th class="created-at">
          <div>Created At</div>
          <input ng-model="search.createdAtFrom"
                 class="form-control input-sm" type="date">
          <input ng-model="search.createdAtTo"
                 class="form-control input-sm" type="date">
        </th>
        <th class="device-group">
          <div>Device Group</div>
        </th>
        <th class="device-name">
          <div>Device Name</div>
          <input ng-model="search.name" class="form-control input-sm" type="text">
        </th>
        <th class="device-type">
          <div>Device Type</div>
          <input ng-model="search.type" class="form-control input-sm" type="text">
        </th>
        <th class="device-id">
          <div>Device ID</div>
          <input ng-model="search.deviceid"
                 class="form-control input-sm" type="text">
        </th>
        <th class="api-key">
          <div>Device Owner</div>
          <input ng-model="search.apikey"
                 class="form-control input-sm" type="text">
        </th>
        <th class="updated-at">
          <div>Last Updated At</div>
          <input ng-model="search.lastModifiedAtFrom"
                 class="form-control input-sm" type="date">
          <input ng-model="search.lastModifiedAtTo"
                 class="form-control input-sm" type="date">
        </th>
      </tr>
    </thead>
    <tbody>
      <tr ng-repeat="device in devices">
        <td>{{device.createdAt | date:'yyyy-MM-dd'}}</td>
        <td>{{device.group}}</td>
        <td>{{device.name}}</td>
        <td>{{device.type}}</td>
        <td>{{device.deviceid}}</td>
        <td>{{device.apikey}}</td>
        <td>{{device.lastModified | date:'yyyy-MM-dd'}}</td>
      </tr>
    </tbody>
  </table>
</div>